<template>
	<div>
		<el-form>
			<el-form-item label="*抵店时间">
				  <el-date-picker
					v-model="chedate"
					type="date"
					value-format="yyyy-MM-dd HH:mm:ss"
					placeholder="选择日期时间">
				  </el-date-picker>
			 </el-form-item>
			 <el-form-item label="*离店时间">
			 	  <el-date-picker
			 		v-model="chedatee"
			 		type="date"
			 		value-format="yyyy-MM-dd HH:mm:ss"
			 		placeholder="选择日期时间">
			 	  </el-date-picker>
			  </el-form-item>
			 <el-button type="primary" @click="select()">查询客房</el-button>
				
				<el-table  :data="rooms.list" style="100%">
					<el-table-column
					label="房间号"
					prop="id"
					width="80"
					></el-table-column>
					
					<el-table-column
					label="房间类型"
					prop="roomTypeid.roletype"
					width="80"
					></el-table-column>
					
					<el-table-column
					label="状态"
					prop="status"
					width="80"
					></el-table-column>
					
					<el-table-column
					label="楼层"
					prop="levelid.storey"
					width="80"
					></el-table-column>
					
					<el-table-column
					label="人数"
					prop="roomTypeid.roomnum"
					width="80"
					></el-table-column>
					
					<el-table-column
					label="普通价格"
					prop="standardprice"
					width="80"
					></el-table-column>
					
					<el-table-column
					label="折扣价格"
					prop="discountprice"
					width="80"
					></el-table-column>
					
					<el-table-column
					label="会员价格"
					prop="commonprice"
					width="80"
					></el-table-column>
					
					<el-table-column
					label="VIP价格"
					prop="vipvip"
					width="80"
					></el-table-column>
				<el-table-column label="操作">
					<template slot-scope="scope">
						 <el-button type="primary" round @click="yuding(scope.row)">入住</el-button>
					</template>
				</el-table-column>
				
					
					</el-table>
					
					<el-pagination
						:total="rooms.total"
						:page-count="rooms.nevigatePages"
						:page-size="rooms.pageSize"
						:current-page="rooms.pageNum"
						
						layout="prev,pager,next,total,jumper"
						background
						@current-change="handleCurrentChange"	
					>
					</el-pagination>
					<el-dialog :visible.sync="disable" title="客房预定" center>
						
						<el-form :inline="true" align="center" :model="type" :rules="rules" ref="loginForm">
						<!--  <el-form-item label="*预定单号">
						    <el-input  v-model="type.duenum"></el-input>
						  </el-form-item> -->
						  <el-form-item label="客房编号" prop="roomcode">
						    <el-input v-model="type.roomcode" ></el-input>
						  </el-form-item>
						  <el-form-item label="客房类型"  prop="roomtype">
						    <el-input v-model="type.roomtype" ></el-input>
						  </el-form-item>
						  <el-form-item label="标准价格"  prop="standardprice">
						    <el-input  v-model="type.standardprice"></el-input>
						  </el-form-item>
						  <el-form-item label="折后价格"  prop="discountprice">
						    <el-input  v-model="type.discountprice"></el-input>
						  </el-form-item>
						  <el-form-item label="押金">
						    <el-input  v-model="type.yajin"></el-input>
						  </el-form-item>
						  <el-form-item label="预定人 "  prop="dueperson">
						   <el-input  v-model="type.dueperson"></el-input>
						  </el-form-item>
						  <el-form-item label="证件类别"  prop="cretype">
						    <el-input  v-model="type.cretype"></el-input>
						  </el-form-item>
						
						<el-form-item label="证件号码"  prop="crenum">
						    <el-input  v-model="type.crenum"></el-input>
						  </el-form-item>
						
						<el-form-item label="电话号码"  prop="phone">
						    <el-input  v-model="type.phone"></el-input>
						  </el-form-item>
						
						<el-form-item label="抵店时间"  prop="arrivetime">
						      <el-date-picker
						        v-model="type.arrivetime"
						        type="datetime"
								value-format="yyyy-MM-dd HH:mm:ss"
						        placeholder="选择日期时间">
						      </el-date-picker>
						 </el-form-item>
						  
						  <el-form-item label="离店时间 "  prop="leavetime">
						     <el-date-picker
								v-model="type.leavetime"
							      type="datetime"
							      value-format="yyyy-MM-dd HH:mm:ss"
							      placeholder="选择日期时间">
							 ></el-date-picker>
						    </el-form-item>
						
						<el-form-item label="入住人数"  prop="roomnum">
						    <el-input  v-model="type.roomnum"></el-input>
						  </el-form-item>
						
						<el-form-item label="操作员">
						    <el-input  v-model="type.caozuoren"></el-input>
						  </el-form-item>
						  
						  <el-form-item label="会员编号">
						      <el-input  v-model="type.vipcode"></el-input>
						    </el-form-item>
							
							<el-form-item label="会员价">
							    <el-input  v-model="type.vipprice"></el-input>
							  </el-form-item>
							  
							 <el-form-item label="提供早餐">
							    <el-select  v-model="type.breakfast">
									<el-option label="是" value="是"></el-option>
									<el-option label="否" value="否"></el-option>
								</el-select>
								
							    </el-form-item>
								<el-form-item label="定时叫醒">
								  <el-select  v-model="type.awaken">
										<el-option label="是" value="是"></el-option>
										<el-option label="否" value="否"></el-option>						
								  </el-select>
								 </el-form-item>
								 <el-form-item label="备注">
									 <el-input
										type="textarea"
									   :rows="2"
									   placeholder="请输入内容"
									   v-model="type.remarks">
									 ></el-input>
								 </el-form-item>
						<br />
							<el-form-item>
								<el-button type="warning" @click="disable = false">取消</el-button>
								<el-button  type="primary" @click="insertType()">预定</el-button>
							</el-form-item>
						
						</el-form>
					</el-dialog>
					
		</el-form>
	</div>
</template>

<script>
	export default{
		data(){
			return{
				chedate:'',
				chedatee:'',
				roomid:'',
				louceng:'',
				rooms:{
					list:[]
				},
				disable:false,
				type:{
					yajin:0
				},
				rules:{
			
					roomcode:[
						{required:true,message:'不能空',trigger:['blur','change']},
					],
					roomtype:[
						{required:true,message:'不能空',trigger:['blur','change']},
					],
					standardprice:[
						{required:true,message:'不能空',trigger:['blur','change']}
					],
					discountprice:[
						{required:true,message:'不能空',trigger:['blur','change']},
					],
					cretype:[
						{required:true,message:'不能空',trigger:['blur','change']},
					],
					dueperson:[
						{required:true,message:'不能空',trigger:['blur','change']}
					],
					crenum:[
						{required:true,message:'不能空',trigger:['blur','change']},
					],
					phone:[
						{required:true,message:'不能空',trigger:['blur','change']},
					],
					roomnum:[
						{required:true,message:'不能空',trigger:['blur','change']}
					],
					
					leavetime:[
						{required:true,message:'不能空',trigger:['blur','change']}
					]
				}
			}
		},
		methods:{
			select(){
				
				
				this.pageInfo(1,5,this.roomid,this.louceng,this.chedate)
			},
			//分页控制
			handleCurrentChange(pageNum){
				this.pageInfo(pageNum,this.rooms.pageSize,this.roomid,this.louceng,this.chedate);
			},
			
			pageInfo(pageNum,pageSize,roomid,louceng,dates){
				
				let url="roominfo/pageinfo"
				axios.post(url,`pageNum=${pageNum}&pageSize=${pageSize}&roomid=${roomid}&louceng=${louceng}&dates=${dates}`).then(resp=>{
					this.rooms = resp.data.data
					this.rooms.list.forEach(o=>{
						//o.registtime = this.parseDate(o.registtime)
						if(o.status == 1){
							o.status = '空房'
						}else if(o.status == 2){
							o.status = '已预定'
						}else if(o.status == 3){
							o.status = '已入住'
						}
						})
				
				})
			},
			yuding(row){
				this.disable =true
				console.log(row);
				let ss=row
				this.type.roomcode=ss.id
				this.type.roomtype=ss.roomTypeid.roletype
				this.type.standardprice=ss.standardprice
				this.type.discountprice=ss.discountprice
				this.type.vipprice=ss.vipvip
			},
			//插入入住表
			insertType(){
				let date = new Date()
				let dates=this.parseDate(date)
				if(this.type.arrivetime >dates && this.type.leavetime >dates){
				this.$refs["loginForm"].validate(valid=>{
					if(valid){
						let url ="Checkin/insert"
						axios.post(url,this.type).then(resp=>{
							if(resp.data.data == 1){
								this.$alert("入住成功！")
								this.disable =false
							}
						})
					}})
					}else{
						this.$alert("请输入正确的时间！！")
					}
			},
			parseDate(s){
				    var d = new Date(s);
				    var year = d.getFullYear();
				    var month = d.getMonth()+1 < 10?'0'+(d.getMonth()+1):(d.getMonth()+1);
				    var date = d.getDate() < 10?'0'+d.getDate():d.getDate();
				    var s = year + "-" + month + "-" + date;			
				    return s;
				}
		}
	}
</script>

<style>
</style>
